<template>
  <div style="font-size: 14px;">
    <div style="width: 100%;text-align: center;margin-bottom: 10px">
      <div style="width: 80%;margin:0 auto;">
        <search @search="shuaxing"/>
      </div>
    </div>
    <good-list :products="products"></good-list>
    <el-empty description="暂无商品" v-if="products == undefined || products.length <= 0"></el-empty>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="form.pageNum"
      :limit.sync="form.pageSize"
      :page-sizes="[8,16,24,36]"
      @pagination="getList"
    />
  </div>

</template>

<script>
import {listMedical3} from "../../../api/system/medical";
import GoodList from "../../components/goodsList";
import Search from "../search/search";

export default {
  components: {Search, GoodList},
  data() {
    return {
      products: [],
      total:0,
      form: {
        pageNum: 1,
        pageSize: 8,
      },
      seach: ""
    };
  },
  created() {
    this.getParams()
  },
  methods: {

    //获取数据
    getList() {
      listMedical3(this.form).then(response => {
        this.products = response.rows
        this.total = response.total;
      });
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
    },
    handleClick(tab, event) {
      console.log(tab, event);
    },
    getParams() {
      var param = this.$route.query.info;
      this.form.medName = param
      this.getList()
    },
    shuaxing(input){
      this.form.medName = input
      this.getList()
    }
  }
};
</script>

<style>
.product:hover {
  cursor: pointer;
  transform: scale(1.05);
  border-top: 1px solid red !important;
}

.picimg {
  height: 150px;
  weight: 150px;
}
</style>
